<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
    <form action="" id="login">
        <!-- placeholder 输入框内默认的文字(用于提示) autofocus 自动聚焦  -->
        <!-- autocomplete 输入有提示 提示为上一次提交成功后的内容 -->
        <!-- 有 on off 值 有两个条件： -->
        <!-- 1. 必须成功提交过 -->
        <!-- 2. 必须有name属性 -->
        用户名：<input type="text" placeholder="请输入用户名" autofocus autocomplete="on" name="user_name"><br>
        <!-- required 必须要输入 -->
        <!-- pattern 正则表达式 必须按(+86(可有可无) 1(后面10个数字)) -->
        手机号：<input type="tel" name="user_phone" required pattern="^(\+86)?1\d{10}$"><br>
        <!-- multiple 可以上传多个文件 -->
        文件：<input type="file" name="photo" multiple><br>
        <!-- 默认邮箱格式 允许输入多个邮箱地址 用逗号分隔开 -->
        邮箱：<input type="email" name="email" multiple><br>
        <input type="submit">
    </form><br>
    <!-- 将表单外的输入框插入表单 -->
    <!-- 1. 表单取id -->
    <!-- 2. form属性填入id -->
    表单外输入框插入表单：<input type="text" name="out_form" placeholder="表单外输入框插入表单" form="login">
</body>
</html>